<script setup>
import { ref } from 'vue';
const arr=ref(['后端：李小阳','后端：孙小鹏','前端：不愿透露姓名的家伙','前端：罗小桃','前端：陈小元'])


</script>

<template>
  <el-carousel :interval="4000" type="card" height="400px">
    <el-carousel-item v-for="item in arr" :key="item">
      <h3 text="2xl" justify="center">{{ item }}</h3>
    </el-carousel-item>
  </el-carousel>
</template>

<style scoped>
.el-carousel__item h3 {
  color: #47695e;
  opacity: 0.75;
  line-height: 350px;
  margin: 0;
  text-align: center;
}

.el-carousel__item:nth-child(2) {
  background-color: #99bf9d;
}
.el-carousel__item:nth-child(4) {
  background-color: #afbf99;
}
.el-carousel__item:nth-child(1) {
  background-color: #e3e6d3;
}
.el-carousel__item:nth-child(3) {
  background-color: #8bc2e7;
}
.el-carousel__item:nth-child(5) {
  background-color: rgb(230, 211, 228);
}
</style>